<template>
  <div class="bind">
    <div class="bind_title">绑定用户</div>
    <div class="bind_input flexcolcenter">
      <input type="number" v-model="userName" placeholder="请输入用户名" />
    </div>
    <div class="bind_input flexcolcenter" style="margin-top: 32rpx">
      <input type="password" v-model="passWord" placeholder="请输入密码" />
    </div>
    <!-- <div class="bind_input flexcolcenter" style="margin-top: 32rpx">
      <picker
        style="height: 100%; width: 100%; line-height: 88rpx"
        @change="bindPickerChange"
        :value="index"
        :range="array"
        placeholder="请选择学校"
        :range-key="'dictLabel'"
      >
        <view class="uni-input flexbet flexcolcenter">
          <view>{{
            index !== "" ? array[index].dictLabel : "请选择学校"
          }}</view>
          <image
            style="width: 36rpx; height: 20rpx"
            src="@/static/images/expand.png"
          ></image>
        </view>
      </picker>
    </div> -->
    <div
      :class="[
        passWord !== '' && userName !== '' ? 'bind_btn' : 'bind_btn_dis',
      ]"
      @click="handleBind"
    >
      立即绑定
    </div>
    <div class="fixed">本小程序仅支持协议客户用户内部使用</div>
  </div>
</template>
<script>
import { getInfoUtilis } from "@/common/utils";
import { bind, dict } from "@/common/api/login.js";
import cropImage from "../../uni_modules/uni-id-pages/pages/userinfo/cropImage/cropImage.vue";
export default {
  components: { cropImage },
  data() {
    return {
      userName: "",
      passWord: "",
      openId: "",
      sessionKey: "",
      currentRoute: "",
      array: [],
      index: 0,
    };
  },
  onLoad(options) {
    console.log(options);
    this.openId = options.openId;
    this.sessionKey = options.sessionKey;
    this.currentRoute = options.currentRoute;
  },
  onShow() {
    // dict({ pageNum: 1, pageSize: 99999, dictType: "cc_source" }).then((res) => {
    //   this.array = res.rows;
    // });
  },
  methods: {
    bindPickerChange(event) {
      this.index = event.detail.value;
      console.log("选择的值为：", this.array[this.index].dictLabel);
    },
    async handleBind() {
      if (this.passWord !== "" && this.userName !== "") {
        let res = await bind({
          openId: this.openId,
          sessionKey: this.sessionKey,
          phoneNumber: this.userName,
          passWord: this.passWord,
        });
        if (res) {
          console.log(res, this.currentRoute);
          if (res.msg !== "登录失败") {
            uni.setStorageSync("token", res.data.token);
            
            uni.showToast({
              title: "绑定成功",
              icon: "success",
              duration: 1500,
            });
            if (uni.getStorageSync("token")) {
              getInfoUtilis().then((res) => {
                uni.reLaunch({
                  url:
                    this.currentRoute &&
                    this.currentRoute !== "undefined" &&
                    this.currentRoute !== undefined &&
                    this.currentRoute !== "pages/login/login"
                      ? "/" + this.currentRoute
                      : "/pages/index/index",
                });
              });
            }
          } else {
            uni.showToast({
              title: "绑定失败",
              icon: "none",
              duration: 1500,
            });
          }
        }
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.bind {
  .bind_title {
    padding: 178rpx 0 108rpx 64rpx;
    font-size: 48rpx;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: 600;
    color: #ff4d03;
    line-height: 66rpx;
  }
  .bind_input {
    box-sizing: border-box;
    padding: 0 60rpx;
    margin: 0 auto;
    width: 622rpx;
    height: 88rpx;
    background: #f5f7f6;
    border-radius: 44rpx;
  }
  .bind_btn_dis {
    margin: 136rpx auto 0 auto;
    text-align: center;
    font-size: 28rpx;
    color: #ffffff;
    line-height: 88rpx;
    width: 622rpx;
    height: 88rpx;
    background: linear-gradient(140deg, #ff4d03 0%, #ff9a00 100%);
    border-radius: 44rpx;
    opacity: 0.4;
  }
  .bind_btn {
    @include btn_plain_line(
      linear-gradient(140deg, #ff4d03 0%, #ff9a00 100%),
      #ffffff,
      #ff9a00
    ) {
      margin: 136rpx auto 0 auto;
      width: 622rpx;
      height: 88rpx;
      border-radius: 44rpx;
    }
  }
}
.fixed {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: fixed;
  bottom: env(safe-area-inset-bottom);
  left: 0;
  font-size: 24rpx;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #333333;
}
</style>
